<!DOCTYPE HTML>
<html>
<head>
  <title>执行力管理</title>
  <link rel="stylesheet" href="/stylesheets/style.css">
  <script src="/scripts/jquery.min.js"></script>
  <script src="/scripts/boot.js" type="text/javascript"></script>
  <link rel="stylesheet" href="/scripts/miniui/themes/default/miniui.css">
  <link rel="stylesheet" href="/scripts/miniui/themes/icons.css">
  <link rel="stylesheet" href="/scripts/miniui/themes/bootstrap/skin.css">
  <link rel="stylesheet" href="/editor/common.css">
  <script src="/scripts/miniui/miniui.js"></script>
</head>
<body  style="padding: 0;width: 100%;height: 98%">
<div style="width:100%;height:87%;">
  <div showCollapseButton="true" style="width: 100%;height: 100%">

    <div style="width:99%;">
      <div class="mini-toolbar" style="border-bottom:0;padding:0px;">
        <table style="width:100%;">
          <tr>
            <td style="width:100%;">
              <a class="mini-button" iconCls="icon-add" onclick="addIdentifyProp()">添加</a>
              <a class="mini-button" iconCls="icon-edit" onclick="editIdentifyProp()">编辑</a>
              <a class="mini-button" iconCls="icon-remove" onclick="delIdentifyProp()">删除</a>
            </td>
          </tr>
        </table>
      </div>
    </div>

    <div id="datagrid1" class="mini-datagrid" style="width:99%;height: 63%;"
         url="/getdata/getUserIdentifyProp" idField="id" allowResize="true" onSelectionChanged="onSelectionChanged"
         sizeList="[20,30,50,100]" pageSize="20"
    >
      <div property="columns">
        <div type="checkcolumn" width="15"></div>
        <div field="objectId" width="60" align="center" align="center" headerAlign="center">用户属性Id</div>
        <div field="name" width="80" align="center" align="center" headerAlign="center">名称</div>
        <div field="category" width="80" align="center" align="center" headerAlign="center">类别</div>
        <div field="type" renderer="userIdentifyPropType" width="80" align="center" align="center" headerAlign="center">类型</div>
        <div field="tableField" width="80" align="center" align="center" headerAlign="center">表名</div>
        <div field="createdAt" width="80" align="center" headerAlign="center">创建日期</div>
        <div field="updatedAt" width="80" align="center" headerAlign="center">更新日期</div>
      </div>
    </div>

    <div style="width:99%;">
      <div class="mini-toolbar" style="border-bottom:0;padding:0px;">
        <table style="width:100%;">
          <tr>
            <td style="width:100%;">
              <a class="mini-button" iconCls="icon-add" onclick="tempAdd()">增加</a>
              <a class="mini-button" iconCls="icon-remove" onclick="tempRemove()">删除</a>
            </td>
          </tr>
        </table>
      </div>
    </div>
    <div id="datagrid2" class="mini-datagrid" style="width:99%;height:30%;" url="/getdata/getUserIdentifyPropRelation"
         sizeList="[20,30,50,100]" pageSize="20" idField="id"  allowResize="true" >
      <div property="columns">
        <div type="checkcolumn" width="15" ></div>
        <div field="objectId" width="60" align="center"  headerAlign="center">用户属性部落关联Id</div>
        <div field="tribeOId" width="60" align="center"  headerAlign="center">部落ID</div>
        <div field="tribeName" width="80" align="center"  headerAlign="center">部落名称</div>
        <div field="tribeAvator" width="60" align="center"  headerAlign="center">部落头像</div>
        <div field="tribeStatus" width="60" align="center"  headerAlign="center">部落状态</div>
        <div field="createdAt" width="80" align="center" headerAlign="center">关系创建日期</div>
      </div>
    </div>
  </div>

</div>
</body>
<script type="text/javascript">
  var objectId;
  var tribeOId;
  mini.parse();
  var grid2 = mini.get("datagrid1");
  var grid3 = mini.get("datagrid2");


  grid2.load();
  function onSelectionChanged(e) {
    var tribeGrid = e.sender;
    var record = tribeGrid.getSelected();
    if (record) {
      objectId = record.objectId;
      grid3.load({objectId:record.objectId});
    }
  }
  grid3.on("drawcell", function (e) {
    var value = e.value;
    var column = e.column;
    if (column.field == "tribeAvator") {
      if (value) {
        e.cellHtml = '<img class="bigImg" onclick="bigImg()" src="' + value + '?imageMogr2/thumbnail/640x/format/jpg/interlace/1/auto-orient" width="30" height="30" alt="图片">';
      } else {
        e.cellHtml = '<img class="bigImg" onclick="bigImg()"  src="http://7xiuo5.com1.z0.glb.clouddn.com/fgImage.png?imageMogr2/auto-orient/thumbnail/!100x100r/gravity/Center/crop/100x100/quality/80/auto-orient" width="30" height="30" alt="图片">';
      }
    }
    if (column.field == "tribeStatus") {
      parseInt(value)
      if (value == -1) {
        e.cellHtml = '<text>删除</text>';
      } else if (value == 0) {
        e.cellHtml = '<text>锁定</text>';
      } else if (value == 1) {
        e.cellHtml = '<text>正常</text>';
      }
    }
  })
  function userIdentifyPropType(e) {
    var value = e.value;
    if (value == 0) {
      return (value, '用户输入')
    }else if(value == 1){
      return (value, '选项选择')
    }
    return (value,'无状态')
  }
  function editIdentifyProp() {
    var row2 = grid2.getSelected();
    if (row2) {
      mini.open({
        url: "/getdata/userIdentifyPropEdit?objectId=" + row2.objectId,
        title: "编辑用户属性", width: 300, height: 260,
        ondestroy: function (action) {
          grid2.reload();
        }
      });
    } else {
      alert("请选中一个用户属性!");
      return;
    };
  };
  function addIdentifyProp() {
    mini.open({
      url: "/editor/userIdentifyPropAdd",
      title: "添加用户属性", width: 300, height: 260,
      ondestroy: function (action) {
        grid2.reload();
        grid3.reload();
      }
    });
  };
  function delIdentifyProp() {
    let currentRow = grid2.getSelected();
    if (currentRow) {
      $.ajax({
        type:"POST",
        url:"/getdata/userIdentifyPropUpdate",
        data:{
          objectId:currentRow.objectId,
          status:1
        },
        success:function (result) {
          grid2.reload();
        }
      })
    }else {
      alert("请选中一个用户属性!");
      return;
    };

  };
  function tempAdd() {
    let currentRow2 = grid2.getSelected();
    if (currentRow2) {
      mini.open({
        url: "/editor/tribeChoice",
        title: "部落选择列表",
        width: 700,
        height: 450,
        ondestroy: function (action) {
          if (action == "ok") {
            var iframe = this.getIFrameEl();
            var data = iframe.contentWindow.GetData();
            data = mini.clone(data);    //必须
            if (data) {
              tribeOId = data.id
              $.ajax({
                type:"POST",
                url:"/getdata/userIdentifyPropRelationAdd",
                data:{
                  objectId:currentRow2.objectId,
                  tribeOId:tribeOId
                },
                success:function (result) {
                  if (result == '1'){
                    grid3.reload();
                    grid2.reload();
                  } else {
                    alert('添加关联部落失败！')
                  }
                }
              })
            }
          } else {
            alert('未获取到部落ID，请重试！')
          }
        }
      });
    }else {
      alert("请选中一个用户属性!");
      return;
    };

  }

  function tempRemove() {
    let row = grid3.getSelected();
    if(row){
      $.ajax({
        url:"/getdata/userIdentifyPropRelationRemove",
        type:"post",
        data:{
          objectId:row.objectId
        },
        success:function (result) {
          if(result =="10001"){
            alert("删除成功");
            grid3.reload();
          }else {
            alert("删除失败")
          }
        }

      })
    }
  }
</script>
</html>
